<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="tfn" uri="http://www.totoro.com/functions" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/public.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/nav.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/layui/css/layui.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/buy/append_evaluation.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/iconFont/iconfont.css"/>
</head>
<body>
<div style="width: 100%; left: 0px; top: 0px; height: 100%; position: fixed; display: none; user-select: none; z-index: 999998;" class="ks-dialog-mask ks-overlay-mask"></div>
<script src="${pageContext.request.contextPath}/static/js/frame/jquery-3.5.1.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/self/buy/appendEvaluation.js"></script>
<script src="${pageContext.request.contextPath}/static/js/frame/totoro-utils.js"></script>
<script src="//unpkg.com/layui@2.6.8/dist/layui.js"></script>
<jsp:include page="/public_page/nav.jsp"></jsp:include>
<div id="content">
    <jsp:include page="/public_page/search_header.jsp"></jsp:include>
    <div id="mainContent">
        <!-- 龙猫提供的商品、tab区域 -->
        <div id="detailBox">
            <div class="db-showpanel">
                <a href="javascript:void(0)">
                    <img align="absmiddle" src="${marketSrOrder.product.productImages.get(0).imagePath}"></a>
            </div>
            <div class="db-icbu">
                <ol class="ui-form-bd">
                    <li class="ui-form-row">
                        <label class="ui-form-label">
                            <h3>${marketSrOrder.product.productName}</h3>
                        </label>
                    </li>
                    <li class="ui-form-row superstar-price">
                        <label class="ui-form-label">价格</label>
                        <div class="ui-form-right"> <strong><fmt:formatNumber value="${marketSrOrder.product.productSpecs.productPrice}" type="currency" pattern=".00"/></strong>
                            <span></span>
                            元
                        </div>
                    </li>
                    <li class="ui-form-row">
                        <label class="ui-form-label">配送</label>
                        <div class="ui-form-right">
                            快递:&nbsp;
                            0.00
                        </div>
                    </li>
                    <!-- 宝贝分数 -->
                    <c:set var="babyScoreCount" value="0"></c:set>
                    <c:forEach items="${productComments}" var="pc">
                        <c:set var="babyScoreCount" value="${babyScoreCount+pc.commentBabyStar}"></c:set>
                    </c:forEach>
                    <c:set var="babyAvg" value="${babyScoreCount / fn:length(productComments)}"></c:set>
                    <li class="ui-form-row evalate">
                        <label class="ui-form-label">评价</label>
                        <div class="ui-form-right">
                            <div id="star"></div>
                            <script>
                                layui.use(['rate'], function() {
                                    var rate = layui.rate;
                                    rate.render({
                                        elem: '#star'
                                        , value: ${babyAvg} //初始值
                                        , half: true //开启半星
                                        , readonly: true
                                    })
                                });
                            </script>
                            <span>
                                <fmt:formatNumber value="${babyAvg}" type="currency" pattern=".0"/>分</span></em>
                            <span>
										(累计评价
										<span class="superstar-ratetotal">${marketSrOrder.product.commentCount}</span>
										)
									</span>
                        </div>
                    </li>
                </ol>

                <c:set var="skuData" value="${marketSrOrder.product.productSpecs.productSpaceData}"></c:set>
                <c:set var="skuDatas" value='${fn:split(fn:replace(fn:replace(skuData, "{" , ""), "}", ""), ",")}'></c:set>
                <ol class="scinfo-bd">
                    <c:forEach begin="0" end="${fn:length(skuDatas)-1}" varStatus="hdVs">
                        <li class="ui-form-row">
                            <label class="ui-form-label">${fn:split(fn:replace(skuDatas[hdVs.index], "\"", ""), "|")[0]}</label>
                        </li>
                    </c:forEach>
                    <li class="ui-form-row">
                        <div class="ui-form-right">
                            <div class="ui-form-valid">
                                <div class="ui-msg ui-form-msg">
                                    <p class="ui-msg-con ui-msg-tip">
                                        现在查看的是 您所购买商品的信息
                                        <br>
                                        于${marketSrOrder.createTime}下单购买了此商品
                                        <s class="ui-msg-icon"></s>
                                    </p>
                                </div>
                            </div>
                        </div>
                    </li>
                </ol>
            </div>
        </div>
        <div class="banner-totalevolute">
            <div class="tv-leftbox">
                <div class="tv-lb-head"></div>
                <div class="tv-lb-content">
                    <span>累计评价</span>
                    <em class="superstar-ratetotal">${marketSrOrder.product.commentCount}</em>
                </div>
                <div class="tv-lb-bottom"></div>
            </div>
            <div class="tv-rightbox">
                <div class="tv-rb-cover">
                    <a href="#miaoposition" hidefocus="true" id="miaoposition">&nbsp;</a>
                </div>
                <div class="tv-rb-bottom"></div>
            </div>
        </div>
        <!-- 写评价组件 -->
        <div id="review" class="rate-w990 tm-rate">
            <div class="rate-compose">
                <form method="post" id="RateWriteForm" action="/order_logic/confirmAppendRate.htm" class="append-inner" enctype="multipart/form-data">
                    <input type="hidden" name="pcId" value="${productComment.id}">
                    <input type="hidden" name="pid" value="${product.id}">
                    <input type="hidden" name="msId" value="${marketSrOrder.id}">
                    <div class="append-main">
                        <div class="append-header"><span>其他买家，需要你的建议哦！</span>
                            <div class="append-scrolltip"><s></s>
                                <ul class="ks-switchable-content">
                                    <li>认真写评价最多可获天猫达人成长值20点！</li>
                                </ul>
                            </div>
                        </div>
                        <div class="append-order append-order-last clearfix">
                            <ul class="append-holder">
                                <li class="ap-prvious">
                                    <div class="ap-timeline"></div>
                                    <div class="ap-tag "> <span class="ap-icon"></span>
                                        <div class="ap-title">初次评价 :</div>
                                        <div class="ap-date"></div>
                                    </div>
                                    <div class="ap-content">
                                        <div class="ap-ct-text ">${productComment.commentText=="totoro yyds"?"未写初评，可以在下面补充哦~":productComment.commentText}</div>
                                        <div class="ap-ct-imglist"> </div>
                                    </div>
                                </li>
                                <li class="ap-this">
                                    <div class="ap-timeline"></div>
                                    <div class="ap-tag "> <span class="ap-icon"></span>
                                        <div class="ap-title">使用感受 :</div>
                                        <div class="ap-date"></div>
                                    </div>
                                    <div class="ap-content">
                                        <div class="ap-ct-textinput">
                                            <textarea contenteditable="true" id="aeText" name="text"></textarea>
                                        </div>
                                        <div class="ap-imageupload">
                                            <div class="uploader-holder">
                                                <div class="grid" id="J_Uploader84"><a href="javascript:void(0)" class="g-u ks-uploader-button"><span
                                                        class="btn-text">电脑晒图</span>
                                                    <div class="file-input-wrapper" style="overflow: hidden;">
                                                        <input class="g-u file-input" id="J_Uploader84Btn" type="button" value="电脑晒图" action="upload.php" postdata="{}" max="3" maxsize="500"></div>
                                                </a></div>
                                                <ul id="J_Uploader84Queue" class="grid upload-queue"></ul>
                                                <div class="up-tips" id="J_Uploader84Tips"><span class="upload-msg">0/5</span></div>
                                            </div>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="compose-submit"> <span class="compose-anony"></span><span class="compose-btn">
                        <input hidefocus="true" id="refer" type="button" value="提交评价" class="layui-btn-danger layui-btn" style="margin-top: -5px;"></span></div>
                </form>
            </div>
            <div class="rate-subject"></div>
            <div class="rate-charts"></div>
            <jsp:include page="../product/comment.jsp"></jsp:include>
            <div class="rate-page">
                <div class="rate-paginator"><span class="rate-page-prev">&lt;&lt;上一页</span><span>1</span><a href="?page=2">2</a><a
                        href="?page=3">3</a><span class="rate-page-break">...</span><a data-page="2" href="?page=2">下一页&gt;&gt;</a></div>
            </div>
            <div class="rate-tryreport"></div>
        </div>
    </div>
    <link rel="stylesheet" type="text/css" href="//g.alicdn.com/??mui/msg/3.0.5/msg-hd.css,mui/servefbk/1.1.0/css/stbtn.css,mui/servefbk/1.1.0/css/view.css,mui/servefbk/1.1.0/css/srmsg.css">
    <!-- 业务逻辑代码-->
    <div id="SV_Review" class="superstar-w750 clearfix rights-offset"></div>
    <div id="_umfp" style="display:inline;width:1px;height:1px;overflow:hidden">
        <img src="https://ynuf.alipay.com/service/clear.png?xt=Tdf05929f023ee3e4a0bfd0152c3ccb11&amp;xa=tmallratewrite">
    </div>
</div>
<jsp:include page="/public_page/open_chat.jsp"></jsp:include>
</body>
</html>
